html,body{
    margin: 0;
    padding: 0;
    height: 100%;
    width: 100%;
    background-color: #8DB6CD;
}
body a{
	text-decoration:none;
}
body a:link{
    text-decoration:none;
    color: #000;
}
body a:hover{
	text-decoration:none;
}

body a:visited{
    text-decoration:none;
    color: #000;
}
.head{
    border:solid 1px #8DB6CD;
    height: 25%;
    width: 100%; 
    background-image: url(../img/bg.jpg);
    background-repeat: no-repeat;
    background-size:cover;

}
.headnav{
    position: relative;
    top: 8%;
    left: 60%;
    width: 30%;
    height: 25%;
    
}
.naveframe{
    position: relative;
    width: 90%;
    height: 100%;
    /*border:solid 1px #fff;*/
    border-top:0px solid #fff;
    border-left:0px solid #fff;
    border-right: 0px solid #fff;
    /*border-style:none solid;/*不显示上下边*/
    box-sizing:border-box;
    border-radius: 8px;
}
.navlist{
}
.naveframemb{
    display: none;
}
.navlist li,.navlistmb li{
    float: left;
    list-style:none;
    width: 30%;
    height: auto;
}
.navlist li a,.navlistmb li a{
    display: block;
    text-align: center;
    text-decoration: none;
    color: white 
}
.navlist li a:hover,.navlistmb li a:hover{
    text-align: center;
    display: block;
    border:solid 1px crimson;
    border-radius: 8px;
    box-shadow: 2px 2px 10px lightcoral;
    text-decoration: none;
    color: crimson;
    height: auto;
    
}

.headtext{
    clear: both;
    position: relative;
    top: 20%;
    margin-left: 5%;
    width: 90%;
    height: 60%;
    color: white;

}
.headtext1{
    position: relative;
    top:5%;
    margin-left: 5%;
    font-size: 0.8000em;
    color: white;
    text-indent:2em;
    letter-spacing:2px;
    line-height:1em;
}
.headtext1 span:hover{
    color: crimson; 
    text-shadow:5px 5px 2px aliceblue;
    cursor:default;
}
.headtext2{
    position: relative;
    top:8%;
    margin-left: 15%;
    font-size: 0.8000em;
    color: white;
    text-indent:2em;
    letter-spacing:2px;
    line-height:1.5em;
}
.headtext2 span:hover{
    color: crimson; 
    text-shadow:5px 5px 2px aliceblue;
    cursor:default;
}
.headsearch{
    position: relative;
    top:2%;
    margin-left: 30%;
    height: 5%;
    margin-bottom:10px;

}
.headsearch span{
    background-color:#fff;
    border:solid 0px crimson;
    border-radius: 8px;
}
.headsearch span:hover{
    cursor: pointer;
    color: crimson;
    border:solid 1px crimson;
    border-radius: 8px;
}
.contents-all{
    margin-top: 1%;
    display:flex;
    justify-content:center; 
    align-items:center; 
    top: 18%;
    height: auto;
    width: 100%;
    
}
.contents{
    display:inline-block;
    width:80%;
    height: auto;
    border:solid 0px #999;
    box-sizing:border-box;
    border-radius: 8px;
    
    
}


.frame{
    margin: 0;
    padding: 0;
    width:100%;
    height: 20%;
    border:solid 0px #999;
    border-radius: 8px;
    background-color: #fff;
    
}
.frame:hover{
    /*
    background-color: #F7F7F7;
    margin: 1px;
    padding: 1px;
    border:solid 1px #999;
    filter:alpha(Opacity=70); 
    opacity: 0.7;
    */
}
.title{
    margin: 1px;
    padding: 2px;
}
.title a:hover{
    color: darkcyan;
  }
.overview{
  
    display: -webkit-box;
    /*-webkit-line-clamp: 1;*/ 
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    text-indent:2em;/*缩进*/
    line-height:2em;/*行高*/
    /*letter-spacing:2px;/*文字间隔*/
    font-size:.800rem;
    word-break: break-word;
    color: #6a6a6a;
    

}

.dtime{
    font-size:.700rem;
    color: #6a6a6a;
    margin: 1px;
    padding: 2px;
}

.footer{
    position: relative;
    top:60%;
    height: 10%;
    width:100%;
    font-size: 0.700rem;
   /* background-color: darkcyan;*/
}
.footertext{
    position: relative;
    text-align: center;
    top: 50%;
    left: 5%;
    width: 90%;
    height: 20%;
    
}
@media screen and (max-width: 700px) {
    .headnav{
        position: relative;
        top: 2%;
        left: 6%;
        width: 60%;
        height: 15%;  
        }
    .naveframe{   
        display: none;
        }
    .naveframemb{
        position: absolute;
        margin-left: 1%;
        width: 100%;
        height: 28px;
        z-index: 3;
        background-image:url(../img/nav.png);
        background-repeat: no-repeat;
        display: block; 
    }
    .navlistmb{
        margin: 0;
        padding: 0;
        display: none;
    }
    .navlistmb li{
        /*float: left;*/
        background-color: lightslategray;
        border:solid 1px #fff;
        list-style:none;
        width: 100%;
        height: auto; 
        }
    .headtext{
        top: 10%;
    }
}
@media screen and (max-height: 420px) {
    .head{
        height: auto;
        width: 100%; 
        background-image: url(../img/bg.jpg);
        background-repeat: no-repeat;
        background-size:cover;
    
    }
}